<template>
  <div class='tableList'>
    <el-table :data="tableData" header-row-class-name='table-title' v-loading="loading" header-cell-class-name='table-head' show-summary>
      <el-table-column label="序号" type="index"></el-table-column>
      <el-table-column :label='chacked.num'>
        <el-table-column prop="name" label="油田名称"></el-table-column>
        <el-table-column label="物探工程">
          <el-table-column prop="num2" label="项目数（个）"></el-table-column>
          <el-table-column prop="num3" label="数据集（个）"></el-table-column>
          <el-table-column prop="num3" label="数据量（条）"></el-table-column>
        </el-table-column>
        <el-table-column label="井筒工程">
          <el-table-column prop="num2" label="井（口）"></el-table-column>
          <el-table-column prop="num3" label="井筒（口）"></el-table-column>
          <el-table-column prop="num3" label="数据量（条）"></el-table-column>
        </el-table-column>
        <el-table-column label="油藏工程">
          <el-table-column prop="num2" label="数据集（个）"></el-table-column>
          <el-table-column prop="num3" label="数据量（条）"></el-table-column>
        </el-table-column>
        <el-table-column label="采油工程">
          <el-table-column prop="num2" label="数据集（个）"></el-table-column>
          <el-table-column prop="num3" label="数据量（条）"></el-table-column>
        </el-table-column>
        <el-table-column label="地面工程">
          <el-table-column prop="num2" label="站库（个）"></el-table-column>
          <el-table-column prop="num3" label="管线（条）"></el-table-column>
          <el-table-column prop="num2" label="数据集（个）"></el-table-column>
          <el-table-column prop="num3" label="数据量（条）"></el-table-column>
        </el-table-column>
      </el-table-column>
    </el-table>
  </div>

</template>

<script>
  import { getList } from '@/api/taskFlow'
  export default {
    data() {
      return {
        loading: false,
        tableData: [
          {
            name: 'oracle数据源',
            num1: '20',
            num2: '20',
            num3: '20'
          },
          {
            name: 'oracle数据源',
            num1: '20',
            num2: '20',
            num3: '20'
          }
        ]
      }
    },
    created() {
      this.getList(this.chacked)
    },
    props: {
      chacked: {
        type: Object,
        default: function() {
          return {
            name: '',
            num: '结构化数据'
          }
        }
      }
    },
    methods: {
      getList(params) {
        this.loading = true
        getList(params).then(response => {
          this.$message.success('请求成功')
          this.loading = false
          this.$nextTick(() => {})
        }).catch(response => {
          this.$message.error('请求出现未知错误')
          this.loading = false
        })
      }
    },
    watch: {
      chacked: {
        handler(val, oldval) {
          this.getList(val)
        },
        deep: true
      }
    }
  }
</script>

<style rel="stylesheet/scss" lang="scss">

</style>